<template>
	<div>
		<Model v-bind:taskId="taskId" v-bind:userId="userId"></Model>
		<div class="container">
	        <!-- 审批信息 -->
	        <div class="info-preview">
	            <div class="h5-list-address content">
	                <div class="h5-list-flex">
	                    <div class="h5-list-title-img">
                    		<img src="../../assets/images/title-address.png">
	                    </div>
                    	房产地址：
	                </div>
	                <div class="white h5-address">{{estateRecord.combinedName}}</div>
	            </div>
	            <div class="h5-list-flex content h5-height-default h5-user-info border-top-bottom-green">
	                <div class="item left-item border-right-green">
	                    <div class="font12"><img src="../../assets/images/title-user.png">发起人</div>
	                    <div class="white">{{subscribeRecord.createNameStr}}</div>
	                </div>
	                <div class="item center-item border-right-green">
	                    <div class="font12"><img src="../../assets/images/title-user.png">经纪人</div>
	                    <div class="white">
	                    	{{subscribeRecord.userName}}
	                    	
	                    </div>
	                </div>
	                <div class="item right-item">
	                    <div class="font12"><img src="../../assets/images/title-user.png">客户姓名</div>
	                    <div class="white">{{customerRecord.customerName}}</div>
	                </div>
	            </div>
	            <div class="content">
	                <div class="h5-list-flex h5-apply-time">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-time.png"></div>
	                    <div>申请时间：{{subscribeRecord.createTime}}</div>
	                </div>
	            </div>
	        </div>
	        <!-- 房产信息 -->
	        <div class="h5-list border-top-bottom-default">
	            <div class="h5-list-box">
	                <div class="h5-list-flex h5-list-title border-bottom-primary green">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-house.png"></div>
	                    	房产信息
	                </div>
	                <div class="content">
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">房&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;产：</div>
	                        <div class="h5-item-content">
	                          	{{estateRecord.combinedName}}
	                        </div>
	                    </div>
	                    
	                     <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">认购编号：</div>
	                        <div class="h5-item-content">{{subscribeRecord.subscribeCode}}</div>
	                    </div>
	                    
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">房源状态：</div>
	                        <div class="h5-item-content">{{estateRecord.roomStatusName}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">成交类型：</div>
	                        <div class="h5-item-content" v-if="subscribeRecord.dealCategory==1">推荐成交</div>
	                        <div class="h5-item-content" v-if="subscribeRecord.dealCategory==2">单独成交</div>
	                        <div class="h5-item-content" v-if="subscribeRecord.dealCategory==3">共同成交</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">认购日期：</div>
	                        <div class="h5-item-content">{{subscribeRecord.subscribeDate}}</div>
	                    </div>
	                     <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">认购转签约日期：</div>
	                        <div class="h5-item-content">{{subscribeRecord.conversionSignDate}}</div>
	                    </div>
	                    
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">建筑面积：</div>
	                        <div class="h5-item-content">{{estateRecord.buildingArea}}m2</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">套内面积：</div>
	                        <div class="h5-item-content">{{estateRecord.innerArea}}m2</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">分摊面积：</div>
	                        <div class="h5-item-content">{{estateRecord.sharingArea}}m2</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">计价面积：</div>
	                        <div class="h5-item-content">{{estateRecord.calculateArea}}m2</div>
	                    </div>
	                    
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">备注：</div>
	                        <div class="h5-item-content">{{subscribeRecord.remark}}</div>
	                    </div>
	                    
	                </div>
	            </div>
	        </div>
	        <!-- After -->
	        <div class="h5-list after">
	            <div class="h5-list-box border-bottom-primary">
	                <div class="h5-list-flex h5-list-title border-bottom-primary h5-title-height-md orange">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-sign-info.png"></div>
	                    认购信息
	                </div>
	                <div class="content">
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">折前单价：</div>
	                        <div class="h5-item-content">{{subscribeRecord.conversionPrice}}元</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default">
	                        <div class="h5-item-label">折前总价：</div>
	                        <div class="h5-item-content">{{subscribeRecord.lumpsumPrice}}元</div>
	                    </div>
	                </div>
	            </div>
	            <div class="h5-list-box border-bottom-primary">
	                <div class="h5-list-flex h5-list-title border-bottom-primary h5-title-height-md orange">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-discount-info.png"></div>
	                    折扣信息
	                </div>
	                <div class="content">
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">折扣/签约单价：</div>
	                        <div class="h5-item-content">{{subscribeRecord.subscribePrice}}元</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">折扣/合同金额：</div>
	                        <div class="h5-item-content">{{subscribeRecord.subscribeAmount}}元</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">折扣金额：</div>
	                        <div class="h5-item-content">{{subscribeRecord.discountAmount}}元</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">折扣比例（%）：</div>
	                        <div class="h5-item-content">{{subscribeRecord.discountRate}}%</div>
	                    </div>
	                    
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">应收认购金：</div>
	                        <div class="h5-item-content">{{subscribeRecord.depositReceivable}}</div>
	                    </div>
	                    
	                     <div class="h5-list-flex h5-height-default">
	                        <div class="h5-item-label">业务状态：</div>
	                        <div class="h5-item-content">认购</div>
	                    </div>
	                   
	                </div>
	            </div>
	            <div class="h5-list-box">
	                <div class="h5-list-flex h5-list-title border-bottom-primary h5-title-height-md orange">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-discount-declare.png"></div>
	                    	折扣说明
	                </div>
	                <div class="content">
	                    <div class="h5-item-txt">{{subscribeRecord.discountNote}}</div>
	                </div>
	            </div>
	        </div>
	        <!-- 客户信息 -->
	        <div class="h5-list border-top-bottom-default">
	            <div class="h5-list-box">
	                <div class="h5-list-flex h5-list-title border-bottom-primary green">
	                    <div class="h5-list-title-img"><img src="../../assets/images/title-user-info.png"></div>
	                    客户信息
	                </div>
	                <div class="content">
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">姓名：</div>
	                        <div class="h5-item-content">{{customerRecord.customerName}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">客户来源：：</div>
	                        <div class="h5-item-content">{{customerRecord.customerOriginName}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">证件类型：</div>
	                        <div class="h5-item-content">{{customerRecord.peDocumentTypeName}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">证件号码：</div>
	                        <div class="h5-item-content">{{customerRecord.peDocumentNumber}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">手机号码：</div>
	                        <div class="h5-item-content">{{customerRecord.customerPhone}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default border-bottom-primary">
	                        <div class="h5-item-label">邮寄地址：</div>
	                        <div class="h5-item-content">{{customerRecord.peContactAddress}}</div>
	                    </div>
	                    <div class="h5-list-flex h5-height-default">
	                        <div class="h5-item-label">邮编：</div>
	                        <div class="h5-item-content">{{customerRecord.pePostcode}}</div>
	                    </div>
	                </div>
	            </div>
	        </div>
	        <!--设置单页面标题-->
	        <Document v-bind:processId="processId"></Document>
	        <!-- 共同购房者 -->
	        <FamilyModel v-bind:buyId="buyId" v-bind:memberType="memberType"></FamilyModel>
	        <!-- 附件 -->
	         <ActivityFile v-bind:objectId="objectId" v-bind:imageType="imageType"></ActivityFile>
	        <!-- 审批进度 h-->
	        <ActivityHistory v-bind:processId="processId" v-bind:userId="userId"></ActivityHistory>
    	</div>
    	<div class="md-overlay"></div>
	    <div class="h5-btn-list">
	        <a class="h5-btn h5-btn-primary md-trigger" data-modal="modal-1" style="width: 100%;">审核</a>
	    </div>
	</div>
</template>

<script type="text/javascript">
	import FamilyModel from '../common/familyModel.vue'
	import ActivityFile from '../common/activityFile.vue'
	import ActivityHistory  from '../common/activityHistory.vue'
	import Model from '../common/modal.vue'
	import Document from '../common/document.vue'
	
	
	export default{
		data(){
			return{
				subscribeDiscountinfo:{},
				estateRecord:{},
				familyMemberRecord:[],
				customerRecord:{},
				subscribeRecord:{},
				memberType:'3',
				buyId:'',
				objectId:'',
				imageType:'2',
				processId:'',
				userId:'',
				taskId:''
				
			}
		},components:{
			Document,
			FamilyModel,
			ActivityFile,
			ActivityHistory,
			Model
		},
		mounted:function(){
			this.initsubscribeDiscount();
		},
		methods:{
			initsubscribeDiscount:function(){
				var _self = this;
				var busKey = _self.$route.params.busKey;
				var url = _self.utilHelper.apiUrl+'/wordFlowData/subscribeDiscount';
				_self.buyId = busKey;
				_self.objectId = busKey;
				_self.processId = _self.$route.params.processId;
				_self.userId = _self.$route.params.userId;
				_self.taskId = _self.$route.params.taskId;
				var params={
					id:busKey
				};
				_self.$http.post(url,params).then((response)=>{
					var body = response.body;
					if(body.res=="1"){
						_self.subscribeDiscountinfo = body.obj;
						_self.estateRecord = _self.subscribeDiscountinfo.estateRecord;
						_self.familyMemberRecord = _self.subscribeDiscountinfo.familyMemberRecord;
						_self.customerRecord = _self.subscribeDiscountinfo.customerRecord;
						_self.subscribeRecord = _self.subscribeDiscountinfo.subscribeRecord;
						
					}else{
						layer.alert("接口异常,请联系管理员");
					}
				});
				
			}
		}
	}
	
</script>